<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      div {
        font-size: 50px;
        font-weight: 700;
      }
    </style>
  </head>

  <body>
    <button>发起请求</button>
    <div></div>
    <!-- <script src="./03.Promise基本用法.js"></script> -->
    <script src="./Promise封装请求方式.js"></script>

    <script>
      // const btn = document.querySelector('button')
      // btn.addEventListener('click', async function () {
      //     const res = await harryAjax({ method: 'GET', url: 'http://ajax-base-api-t.itheima.net/api/getbooks' })
      //     console.log(res);
      // })
      Promise.all([
        harryAjax({
          method: 'GET',
          url: 'http://ajax-base-api-t.itheima.net/api/getbooks',
          data: { id: 1 },
        }),
        harryAjax({
          method: 'GET',
          url: 'http://ajax-base-api-t.itheima.net/api/getbooks',
          data: { id: 2 },
        }),
        harryAjax({
          method: 'GET',
          url: 'http://ajax-base-api-t.itheima.net/api/getbooks',
          data: { bookname: '三国演义' },
        }),
      ])
        .then((res) => {
          document.querySelector('div').innerHTML = '我是界面'
          console.log(res)
        })
        .catch((err) => {
          document.querySelector('div').innerHTML = 'the server responded with a status of 404 (Not Found)'
          console.log(err)
        })
    </script>
  </body>
</html>
